<template>
	<view class="tiezilist">
		<view class="top">
			<image src='../../static/businessImg/back.png' class="topback" @click="back">
			</image>
			<view class="topname">
				我的帖子
			</view>
		</view>

		<view class="tiezilistcenter">
			<view class="tiezilistitem" v-for="(item, index) in list" :key="index" @click="handleGoToDetail(item)">
				<view class="tiezilistitemtime">
					{{item.createTime}}
					<view class="delview" @click="handleDelTiezi(item)">
						删除
					</view>
				</view>
				<view class="tiezilistitemtitle">
					{{item.title}}
				</view>
				
				
				<view class="tiezilistitempic1" v-if="item.productImage!=null && item.productImage.length != 0 && item.productImage.split(',').length == 1 && item.type == 2">
					<!-- <image :src="item.productImage" style="height: 367rpx;" @click.stop="previewImage([item.productImage], item.productImage)"></image> -->
					<image :src="item.productImage" style="height: 367rpx;" @click.stop="navigateTo(`/pages/gongyingshang/shangpinxiangqing?id=${item.productId}&from=tiezi`)" v-if="from == 'gys'"></image>
					<image :src="item.productImage" style="height: 367rpx;" @click.stop="navigateTo(`/pages/business/shangpinxiangqing?id=${item.productId}&from=tiezi`)" v-else></image>
				</view>
				
				
				<view class="tiezilistitempic2" v-if="item.productImage!=null && item.productImage.length != 0 && item.productImage.split(',').length > 1 && item.type == 2">
					<view class="tiezilistitempicitem" v-for="(i, index) in item.productImage.split(',')" :key="index" @click.stop="previewImage(item.productImage.split(','),i)">
						<image :src="i" mode="" style="width: 218rpx;height: 218rpx;"></image>
					</view>
				</view>
				
				<view class="tiezilistitempic1" v-if="item.image!=null &&item.image.length != 0 && item.image.split(',').length == 1 && item.type == 1">
					<image :src="item.image" style="height: 367rpx;" @click.stop="previewImage([item.image],item.image)"></image>
				</view>
				
				<view class="tiezilistitempic2" v-if="item.image!=null && item.image.length != 0 && item.image.split(',').length > 1 && item.type == 1">
					<view class="tiezilistitempicitem" v-for="(i, index) in item.image.split(',')" :key="index" @click.stop="previewImage(item.image.split(','),i)">
						<image :src="i" mode="" style="width: 218rpx;height: 218rpx;"></image>
					</view>
				</view>


			</view>

			<view class="lasttiezilist">
				<view class="btnss" @click="navigateTo(`/pages/business/tiezishangchuan?from=${from}`)">
					发布新帖子
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	
	import {
		postsList,
		delPosts
	} from '@/api/storeAdmin.js'
	
	import storage from '@/utils/storage.js';
	export default {
		data() {
			return {
				list: [
				],
				page: 1,
				limit: 10,
				from: ""
			}
		},
		
		onShow() {
			this.list = []
			this.page = 1
			this.getList()
		},
		
		onLoad(option) {
			this.from = option.from
		},
		
		onReachBottom() {
			this.page = this.page + 1
			this.getList()
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				});
			},
			
			previewImage(urls,current) {
			     uni.previewImage({
			       urls: urls, // 需要预览的图片 HTTP 链接列表
			       current: current // 当前显示图片的链接，不填则默认为 urls 的第一张
			     });
			   },

			navigateTo(url) {
				console.log(url)
				uni.navigateTo({
					url: url
				})
			},
			
			handleGoToDetail(item){
				uni.navigateTo({
					url: `/pages/business/tieziDetail?id=${item.id}`
				})
			},
			
			handleDelTiezi(item){
				
				delPosts({
					id: item.id
				}).then(res => {
					this.list = []
					this.page = 1
					this.getList()
				})
				
			},
			
			getList(){
				postsList({
					page: this.page,
					limit: this.limit,
					id: storage.getUserInfo().storeId
				}).then(res => {
					this.list = [...this.list, ...res.data.list]
				})
			}
		}
	}
</script>

<style scoped>
	.tiezilist {
		width: 100%;
		min-height: 100vh;
	}

	.top {
		width: 100%;
		height: 188rpx;
		position: relative;
		background: #FFFFFF;
	}

	.topback {
		width: 16rpx;
		height: 29rpx;
		position: absolute;
		top: 106rpx;
		left: 32rpx;
	}

	.topname {
		width: 300rpx;
		height: 32rpx;
		text-align: center;
		font-family: Adobe Heiti Std;
		font-weight: normal;
		font-size: 33rpx;
		color: #222222;
		line-height: 32rpx;
		position: absolute;
		top: 104rpx;
		left: 50%;
		transform: translateX(-50%);
	}

	.tiezilistcenter {
		width: 100%;
		padding: 0 18rpx;
		padding-bottom: 140rpx;
	}

	.tiezilistitem {
		width: 100%;
		padding: 25rpx;
		margin-top: 25rpx;
		background: #FFFFFF;
	}

	.tiezilistitemtime {
		display: flex;
		justify-content: space-between;
		font-family: HiraginoSansGB;
		font-weight: normal;
		font-size: 29rpx;
		color: #6E7479;

	}

	.tiezilistitemtitle {
		width: 100%;
		font-family: HiraginoSansGB;
		font-weight: normal;
		font-size: 33rpx;
		color: #202224;
		line-height: 40rpx;
		margin-top: 17rpx;
	}

	.tiezilistitempic1 {
		width: 100%;
		height: 367rpx;
		margin-top: 27rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.tiezilistitempic2 {
		width: 100%;
		margin-top: 27rpx;
	}

	.tiezilistitempicitem {
		width: 214rpx;
		height: 214rpx;
		margin-top: 5rpx;
		margin-right: 5rpx;
		display: inline-block;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.lasttiezilist {
		width: 100%;
		background: rgb(249, 250, 251);
		height: 136rpx;
		position: fixed;
		bottom: 0;
	}

	.btnss {
		width: 709rpx;
		height: 90rpx;
		border-radius: 45rpx;
		line-height: 90rpx;
		text-align: center;
		font-family: Adobe Heiti Std;
		font-weight: normal;
		font-size: 43rpx;
		color: #FFFFFF;
		background: rgb(148, 207, 57);

	}
</style>
